![【AppSheet】スマホでスキャンしたQRコードの情報をDynamoDBに登録するアプリを作ってみた](https://devio2023-media.developers.io/wp-content/uploads/2021/04/appsheet.png)
【AppSheet】スマホでスキャンしたQRコードの情報をDynamoDBに登録するアプリを作ってみた
こんにちは、CX事業本部の若槻です。
今回は、ノーコード開発プラットフォームAppSheetを使用して、スマホでスキャンしたQRコードの情報をDynamoDBに登録するアプリを作ってみました。
やってみる
アプリ作成の準備
アプリ作成の準備としてAWS側とAppSheet側で下記の実装を行いました。手順は前回の記事の内容の記載のままですのでここでは省略します。
- AWS側の実装
- DynamoDBテーブルの作成
- S3バケットの作成
- IAMポリシーの作成
- IAMユーザーの作成、ポリシーのアタッチ、APIキーの発行
- AppSheet側の実装
- データソースの追加
DynamoDBテーブルは下記内容で作成しました。
- テーブル名:
scanned_data
- パーティションキー:
scannedContent
アプリの作成
続いてアプリを作成します。
DynamoDBテーブルとの接続
AppSheetのコンソールにアクセスし、[My apps]で[Make a new app]をクリックします。
するとダイアログが表示されます。
[Start with your own data]を選択します。
適当なアプリ名を入力し、[Choose your data]をクリックします。
アカウントに追加したデータソースを選択します。
[Tables]をクリックして展開します。
先程作成したDynamoDBテーブルを選択して接続します。
すると選択したテーブルをデータソースとしたアプリの編集を行うキャンバス画面が開きます。
カラムの定義
まずデータのカラムの定義を行います。[Data] - [Columns]タブで、[<テーブル名>]をクリックします。
ここでカラムを下記の通り指定します。
NAME | TYPE | KEY? | LABEL? | SHOW? | EDITABLE? | REQUIRE? | INITIAL VALUE | SCAN? | |
---|---|---|---|---|---|---|---|---|---|
1 | _RowNumber | Number | No | No | No | No | Yes | - | No |
2 | scannedContent | Text | Yes | Yes | Yes | No | Yes | - | Yes |
3 | scannedAt | Text | No | No | Yes | No | Yes | TEXT(NOW(),"YYYY/MM/DDTHH:MM:SS") | No |
4 | scannedBy | Text | No | No | Yes | No | Yes | USEREMAIL() | No |
5 | scannedLocale | LatLong | No | No | Yes | No | Yes | HERE() | No |
SCAN?
にチェックを入れたカラムは、データ編集時にカメラによるコードのスキャンにより値を入力できるようになります。
INITIAL VALUE
の指定により、scannedAt
はスキャン時の日時、scannedBy
はスキャンしたユーザー、scannedLocale
はスキャンした緯度経度が自動で入力されるようにしています。これによりQRコードの情報と合わせて「いつ」「どこで」「誰が」読み取ったのかを記録することができます。
許可された操作の制限
次にテーブルのデータに対して許可された操作を制限する設定を行います。今回はデータの「追加」「読み取り」は可能、「更新」「削除」は不可という設定とします。
[Table]タブで[<テーブル名>]をクリックします。
[Are updates allowed?]でAdds
のみ選択された状態とします。
これでアプリの作成は完了です。右上の[SAVE]を押してアプリを保存します。
動作確認
スマートフォン端末でAppSheetアプリを立ち上げます。
未インストールの方は以下からインストールしてください。
ログインしたアカウントで利用可能なアプリ一覧が表示されるので、今回作成したアプリを選択して開きます。
右下の[+]をクリックします。
データの入力画面が開きます。scannedContent
以外は自動で値が入力されていますね。scannedContent
入力欄の右端のQRマークをクリックします。
カメラが起動するのでQRコードにカメラを向けると自動でコードが読み取られます。
入力欄に読み取った情報が自動入力されます。右下の[Save]をクリックしてデータを登録します。
データ一覧に戻ると、登録したデータが追加されていますね。
DynamoDBテーブルの方にもデータの登録が反映されています。
おわりに
AppSheetを使ってスマホでスキャンしたQRコードの情報をDynamoDBに登録するアプリを作ってみました。
これにより備品管理や検収作業をQRコードのスキャンにより簡素化する、といった仕組みが簡単に作れそうですね。
以上